<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<script type="text/javascript">
var xmlHttpRequest = null;//declare a null object to receive XMLHTTPRequest object

function ajaxSubmit(){
	
	//alert(window.ActiveXObject);
	
	if(window.ActiveXObject) // for IE browser
	{
		xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
		
	}else if(window.XMLHttpRequest) // for other browsers
	{
		xmlHttpRequest = new XMLHttpRequest();
	}
	
	if(null!=xmlHttpRequest){
		var v1 = document.getElementById("value1ID").value;
		var v2 = document.getElementById("value2ID").value;
		xmlHttpRequest.open("POST","AjaxServlet", false);
		//associated ajax's callback function
		xmlHttpRequest.onreadystatechange = ajaxCallback;
	    //Send data to server-end
		//Use post to submit parameters must include the line below:
		xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
		xmlHttpRequest.send("v1="+v1+"&v2="+v2);
	}
}

function ajaxCallback(){
	if(xmlHttpRequest.readyState ==4){
		if(xmlHttpRequest.status==200){
			var responseText = xmlHttpRequest.responseText;
			document.getElementById("div1").innerHTML=responseText;
		}
	}
	
}
</script>
</head>
<body>

<input type="button" value="get content from server" onclick="ajaxSubmit()"><br>
<input type="text" name="value1" id="value1ID"><br>
<input type="text" name="value2" id="value2ID"><br>
<div id="div1"> </div>

</body>
</html>